The latest updates on your projects. Learn more about Vercel for Git ↗︎

I second to this. I had to fallback to a Modal to show expanded info.

I also think I should be animated. Can Accordion be re-used?

Would love to see this soon :)

Any update on this?

I would love to see this feature released

any news about this?

any progress?

@benjamincanac would be great to have this merged. This feature is so missing in NuxtUi tables at the moment. PR has been here for some time. At least, feedback would be appreciated. Thank you

I'm so sorry for the delay! I've made a few changes to make the button configurable and to animate the icon 😊

This is great! Thanks!

Great feature! However,

Not sure if I should post this here or as a separate bug, but if a table is set as expandable, and the table is empty at the same time, the emptyState will not take up the full width. See screenshot.

      <UTable
        :rows="selectedOrders"
        :columns="selectedOrdersColumns"
        class="w-full"
      >
        <template #id-data="{ row }">
          <span>{{ truncateUUID(row.id) }}</span>
        </template>
        <template #product-data="{ row }">
          <span>{{ row.product }}</span>
        </template>
        <template #expand="{ row }">
          <div class="p-4">
            <ul>
              <li>Bestelnummer: {{ row.id }}</li>
              <li>Aangemaakt op: {{ row.created_at }} door {{ row.created_by_full_name }}</li>
            </ul>
          </div>
        </template>
      </UTable>

simply removing the expand slot immediately solves it. any ui directives or making a custom empty state slot can not fix it.

@rmbakker88 could I ask you to open up a new issue with a reproduction link?

Expanding a row by clicking on it is currently not possible. That feature is definitely needed.
Please make the openedRows value accessible externally.